<template>
  <d2-container>
    <template slot="header">

      <el-form :gutter="24" ref="search-box" :model="mainQuery" label-position="left" :inline="true" label-width="90px" size="mini">
        <el-row>
          <el-form-item label="商户号">
            <el-input placeholder="" v-model="mainQuery.mchNo" @keyup.enter.native="handleSearch" size="small" clearable></el-input>
          </el-form-item>
          <el-form-item label="审批状态">
            <el-select v-model="mainQuery.handleStatus" clearable @change="fetchMainData">
              <el-option v-for="(item,index) in handleStatusList" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="类型">
            <el-select v-model="mainQuery.type" clearable @change="fetchMainData">
              <el-option v-for="(item,index) in typeStatusList" :key="index" :label="item.label" :value="item.value"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="时间区间">
            <el-date-picker v-model="mainQuery.createTimeRange" @change="fetchMainData" type="daterange" value-format="yyyy-MM-dd HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
          </el-form-item>
        </el-row>

      </el-form>

      <div class="search-btn-box">

        <div class="left">
          <el-button-group>

            <el-button class="filter-item" icon="" :type="canCheck() ? 'success' : 'info'" @click="handleAction('check')" :disabled="!canCheck()" size="mini" v-if="
                $options.filters['checkButtonAccess']('tradeTrans-withdrawFirstReview') && 
                $options.filters['checkButtonAccess']('tradeTrans-transferFirstReview')
              ">初审</el-button>
            <el-button class="filter-item" icon="" :type="canRecheck() ? 'success' : 'info'" @click="handleAction('recheck')" :disabled="!canRecheck()" size="mini" v-if="
                $options.filters['checkButtonAccess']('tradeTrans-withdrawSecondReview') && 
                $options.filters['checkButtonAccess']('tradeTrans-transferSecondReview')
              ">终审</el-button>
          </el-button-group>
        </div>
        <div class="right">
          <el-button class="filter-item" icon="el-icon-refresh" type="default" @click="resetMainData" :loading="mainTable.loading" size="mini">重置</el-button>
          <el-button class="filter-item" icon="el-icon-search" type="primary" @click="resetMainData" :loading="mainTable.loading" size="mini">查询</el-button>
        </div>
      </div>

    </template>

    <!--主列表数据-->
    <d2-crud ref="d2Crud" :options="mainTable.options" :index-row="mainTable.indexRow" :columns="mainTable.columns" :data="mainTable.list" :selection-row="mainTable.allowSelect" :loading="mainTable.loading" @current-change="onMainCurrentChange" @row-dblclick="onMainDoubleClick" @selection-change=""></d2-crud>
    <template slot="footer">
      <el-pagination @size-change="handleMainSizeChange" @current-change="handleMainPageChange" :current-page="mainTable.pagination.currentPage" :page-sizes="mainTable.pagination.pageSizes" :page-size="mainTable.pagination.pageSize" :page-count="mainTable.pagination.pageCount" :total="mainTable.pagination.total" layout="total, sizes, prev, pager, next, jumper" :background="true">
      </el-pagination>
    </template>
    <dialog-action ref="dialog-action" @dialog-close="fetchMainData"></dialog-action>
  </d2-container>
</template>

<script>
import util from "@/libs/util";
import ApiMain from "@/api/tradeTrans.list";
import DialogAction from './dialog-action';
import ApiAccountAccessType from "@/api/settle.accountAccessType";
export default {
  name: "list",
  mixins: [],
  components: {
    DialogAction
  },
  data() {
    return {
      mainQuery: {
        mchNo: undefined,
        handleStatus: undefined,
        type: undefined,
        createTimeRange: [],
      },
      typeStatusList: [
        { value: 1, label: '提现' },
        { value: 2, label: '转账' },
      ],
      handleStatusList: [
        { value: 0, label: '初审待审' },
        { value: 1, label: '初审通过' },
        { value: 2, label: '初审驳回' },
        { value: 3, label: '复审通过' },
        { value: 4, label: '复审驳回' }],
      mainQueryRaw: null,
      mainTable: {
        loading: false,
        options: {
          border: true,
          stripe: true,
          highlightCurrentRow: true,
          emptyText: "暂无数据",
          size: "mini",
        },
        // indexRow: {
        //   title:'序号',
        //   width: "80",
        //   align:'center'
        // },
        indexRow: null,
        allowSelect: false,
        columns: [
          // 终端号
          { title: '单号', key: 'transNo', align: 'center', width: '180', showOverflowTooltip: true },
          { title: '商户号', key: 'mchNo', align: 'center', showOverflowTooltip: true },

          { title: '操作类型', key: 'strType', align: 'center', showOverflowTooltip: true },
          { title: '申请金额', key: 'transAmount', align: 'center', showOverflowTooltip: true },
          { title: '手续费金额', key: 'transFee', align: 'center', showOverflowTooltip: true },
          { title: '申请币种', key: 'transCurrency', align: 'center', showOverflowTooltip: true },
          { title: '目标金额', key: 'targetAmount', align: 'center', showOverflowTooltip: true },
          
          { title: '目标币种', key: 'targetCurrency', align: 'center', showOverflowTooltip: true },
          {
            title: '初审状态', key: 'strReviewStatus', align: 'center', showOverflowTooltip: true
          },
          {
            title: '终审状态', key: 'strReReviewStatus', align: 'center', showOverflowTooltip: true
          },
          { title: '申请时间', key: 'createTime', align: 'center', width: '180', showOverflowTooltip: true },
        ],
        list: [{}, {}, {}],
        pagination: {
          currentPage: 1,
          pageSize: 50,
          total: 0,
          pageSizes: [50, 100, 200],
        },
        current: null,
      },
    };
  },
  mounted() {

    this.resetMainData();

  },

  methods: {


    canCheck() {
      if (this.mainTable.loading) return false;
      if (!this.mainTable.current) return false;
      return this.mainTable.current.handleStatus == 0 
    },

    canRecheck() {
      if (this.mainTable.loading) return false;
      if (!this.mainTable.current) return false;
      return this.mainTable.current.handleStatus == 1
    },

    showTransfer(action) {
      if (!!this.mainTable.current) {
        this.$refs["dialog-withdraw"].show(Object.copy(this.mainTable.current), action);
      }
    },
    showWirhdraw() {
      if (!!this.mainTable.current) {
        this.$refs["dialog-transfer"].show(Object.copy(this.mainTable.current));
      }
    },

    renderMainData(re) {
      console.log('数据', re)

      re.list.forEach(item => {
        item.transAmount  = (item.transAmount / 100).toFixed(2);
        item.targetAmount = (item.targetAmount / 100).toFixed(2);
        item.transFee     = (item.transFee/100).toFixed(2);
      })
      this.mainTable.list = re.list;
      this.mainTable.pagination.total = re.total;

      console.log(this.mainTable.list)


    },

    handleMainSizeChange(val) {
      this.mainTable.pagination.pageSize = val;
      this.mainTable.pagination.currentPage = 1;
      this.fetchMainData();
    },
    handleMainPageChange(val) {
      this.mainTable.pagination.currentPage = val;
      this.fetchMainData();
    },

    buildMainQuery() {
      var query = {
        page: this.mainTable.pagination.currentPage,
        limit: this.mainTable.pagination.pageSize,
        search: this.mainQuery,
      };

      return query;
    },

    resetMainData() {
      this.fetchMainData();
    },

    onMainSelectionChange(now, old) {
      console.log("?")
      this.mainTable.selectionRow = now
    },


    handleSet() {

    },
    async fetchOptions() { },

    async fetchMainData() {
      this.mainTable.loading = true;
      try {
        var re = await ApiMain.list(this.buildMainQuery());
        this.renderMainData(re);
      } catch (err) { }

      this.mainTable.loading = false;
    },

    onMainCurrentChange(now, old) {
      console.log(now, '点击')
      this.mainTable.current = now;
    },

    onMainDoubleClick(now) {
      this.mainTable.current = now;
    },

    handleAction(action) {
      if (!!this.mainTable.current) {
        this.$refs['dialog-action'].show(Object.copy(this.mainTable.current), action);
      }
    },
  },
};
</script>

<style>
</style>
